import React, { FC, useEffect, useState } from 'react'
import { Button, Card, Form, Input, Radio, Select } from 'antd'
import Modal from 'antd/lib/modal/Modal';
import { getModuleList } from '@/services/proModule';
import { getSuperFileList } from '@/services/proTable';
const Option = Select.Option;

const formTailLayout = {
  labelCol:{span:7},
  wrapperCol:{ span: 15 }
}

const FormItem = Form.Item
const defaultModule = {id: 0, name: "", show_name: "-公共模块-"};
const defaultSuper = {id: 0, name: "", comment: "-无继承-"};
const fileTypeList = ['controller','service','domain','vo','page','dao'];

interface FileFormProps {
  visible:boolean,
  showFileVisible:any,
  fileHandleOk:any,
  projectId:string,
  fileType:string,
  microId:any,
}

const FileForm: FC<FileFormProps> = (props) => {
  const [form] = Form.useForm();
  const { visible,showFileVisible,fileHandleOk,projectId,fileType,microId } = props;
  const [superFileList,setSuperFileList] = useState<any>([defaultSuper]);
  const [moduleList,setModuleList] = useState<any>([defaultModule]);


  useEffect(()=> {
    form.resetFields();
   if (visible) {
     const par:any = {project_id:projectId}
     // 如果文件类型为Vo 则查询出继承的表
     if (fileType === "vo") {
       getSuperFile();
     }
     // 根据 项目Id 微服务Id 查询出下面模块
     if (microId != '0'){
       par.micro_id = microId;
     }
     getModuleList(par).then((res) =>{
       if (res.code === 10000) {
         setModuleList([defaultModule,...res.data])
       }
     })
   }
  },[projectId,visible])


  const getSuperFile = () =>{
    getSuperFileList({project_id:projectId,flag:'yes'}).then((res) => {
      if (res.code === 10000) {
        setSuperFileList([defaultSuper,...res.data]);
      }
    })
  }

  const handleOk = async () => {
    const { validateFields } = form;
    const values = await validateFields();
    fileHandleOk(values);
  }

  const fetchTableList = (value:string)=> {
    const { setFieldsValue } = form;
    if(value == 'vo') {
      getSuperFile();
    } else {
      setFieldsValue({'super_id':0,'name':null});
      setSuperFileList([defaultSuper]);
    }
  }

  const selectDomain = (id:any) => {
    const { setFieldsValue } = form;
    const seldDomain = superFileList.filter((value:any) => value.id === id)[0];
    let name:any =  startValue(seldDomain.name)+'Vo';
    if (id == 0){
      name = null
    }
    setFieldsValue({'name':name});
  }

  // 开头字母切换成大写
  const startValue = (value:string) =>{
    if (!value) return '';
    const arr = value.split("_");
    let val = "";
    for (let item of arr) {
      val += item.trim().toLowerCase().replace(item[0], item[0].toUpperCase());
    }
    return val;
  }

  const initData = {module_id:0,super_id:0,file_type:fileTypeList.indexOf(fileType) > -1 ? fileType : null,paradigm:'no',class_type:'class'}

  return (
    <Modal
      getContainer={false}
      width={600}
      keyboard={false}
      maskClosable={false}
      visible={visible}
      title="添加文件"
      onOk={handleOk}
      onCancel={() => showFileVisible(false)}
      footer={[
        <Button key="back" onClick={() => showFileVisible(false)}>关闭</Button>,
        <Button key="submit" type="primary" loading={false} onClick={handleOk}>
          确定
        </Button>,
      ]}
    >
      <Form form={form} initialValues={initData} onFinish={()=> handleOk()}>
        <FormItem {...formTailLayout} name="module_id"  rules={[{ required: true, message: '请选择所属模块' }]} label="所属模块">
          <Select placeholder="请选择所属模块">
            {moduleList.map((value:any, index:number) =>{
              return (<Option key={'module_list_' + index} value={value.id}>{value.name}-{value.show_name}</Option>)
            })}
          </Select>
        </FormItem>
        <FormItem {...formTailLayout} name="super_id"  rules={[{ required: true, message: '请选择继承对象' }]} label="继承对象">
          <Select placeholder="请选择继承对象" onChange={selectDomain}>
            {superFileList.map((value:any, index:number) =>{
              return (<Option key={'super_file_' + index} value={value.id}>{value.name}-{value.comment}</Option>)
            })}
          </Select>
        </FormItem>
        <FormItem {...formTailLayout} name="name"  rules={[{ required: true, message: '请输入文件名称' }]} label="文件名称">
          <Input placeholder="请输入文件名称"/>
        </FormItem>
        <FormItem {...formTailLayout} name="file_type"  rules={[{ required: true, message: '请选择文件类型' }]} label="文件类型">
          <Select placeholder="请选择文件类型" onChange={fetchTableList}>
            {fileTypeList.map((value, index) =>{
              return (<Option key={'file_type_' + index} value={value}>{value}</Option>)
            })}
          </Select>
        </FormItem>
        <FormItem {...formTailLayout} name="paradigm"  rules={[{ required: true, message: '请选择是否泛型' }]} label="泛型">
          <Radio.Group>
            <Radio.Button value="yes">是</Radio.Button>
            <Radio.Button value="no">否</Radio.Button>
          </Radio.Group>
        </FormItem>
        <FormItem {...formTailLayout} name="class_type"  rules={[{ required: true, message: '请选择class类型' }]} label="class类型">
          <Radio.Group>
            <Radio.Button value="class">class</Radio.Button>
            <Radio.Button value="enum">enum</Radio.Button>
          </Radio.Group>
        </FormItem>
      </Form>
    </Modal>
  )
}
export default FileForm
